import React, { PureComponent, createRef } from 'react'

class Count extends PureComponent {
  constructor() {
    super()

    this.state = {
      counter: 1
    }
  }

  render() {
    return (
      <div>
        <h2>当前计数：{this.state.counter}</h2>

        <button onClick={e => this.increment()}>+1</button>
      </div>
    )
  }

  increment() {
    this.setState({
      counter: this.state.counter + 1
    })
  }
}

export default class App extends PureComponent {
  constructor() {
    super()

    this.countRef = createRef()
  }

  render() {
    return (
      <div>
        <Count ref={this.countRef} />
        <hr />

        <button onClick={e => this.AppBtnClick()}>AppBtn</button>
      </div>
    )
  }

  AppBtnClick() {
    this.countRef.current.increment()
  }
}
